<template>
<div id="footer">
  <ul>
    <router-link :to="{path:'/index'}" tag="li" active-class="act">
      <i class="icon iconfont icon-changyonglogo40"></i>
      <p>外卖</p>
    </router-link>
    <router-link :to="{path:'/dingdan'}" tag="li" active-class="act">
      <i class="icon iconfont icon-icon"></i>
      <p>订单</p>
    </router-link>
    <router-link :to="{path:'/faxian'}" tag="li" active-class="act">
      <i class="icon iconfont icon-faxian"></i>
      <p>发现</p>
    </router-link>
    <router-link :to="{path:'/wode'}" tag="li" active-class="act">
      <i class="icon iconfont icon-wode"></i>
      <p>我的</p>
    </router-link>
  </ul>
</div>
</template>
<script>
export default {

}
</script>
<style lang="less" scoped>
@import "../../static/less/var.less";
#footer {
  width: 100%;
  height: @base*100rem;
  background: #fff;
  position: fixed;
  bottom: 0;
    ul {
      width: 100%;
        height: @base*100rem;
        display: flex;
        .act{
          color: #0094FF;
        }
        li{
           flex:1;
           text-align: center;
           font-size: @base*32rem;
            i{
              font-size: @base*32rem;

            }
        }
    }

}
</style>
